$('#btn').on("click",function () {
    var keyword=$('#key').val();
    $.ajax({
        url:'/experience_analysis/',
        type:"post",
        data:{"keyword":keyword},
        success:function (arg) {
            var x_list=arg.x_list;
            var y_list=arg.y_list;
            var dict_data=arg.dict_data;
            var myCharts=echarts.init(document.getElementById("main"));
            var  option = {
                    title:[{
                        text:"工作经验数据分析图",
                        subtext: '数据来自网络'
                    }],
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'shadow',
                            label: {
                                show: true
                            }
                        },
                    },
                    toolbox: {
                        show: true,
                        feature: {
                            mark: {show: true},
                            dataView: {show: true, readOnly: false},
                            magicType: {show: true, type: ['line', 'bar']},
                            restore: {show: true},
                            saveAsImage: {show: true}
                        },
                    },
                    calculable: true,
                    grid: {
                        top: '20%',
                        left: '5%',
                        right: '40%',
                        containLabel: true
                    },
                    xAxis: [
                        {
                            type: 'value',
                            axisLabel: {
                                formatter: function (a) {
                                    a = +a;
                                    return isFinite(a)
                                        ? echarts.format.addCommas(+a )
                                        : '';
                                }
                            },
                            data:y_list
                        }

                    ],
                    yAxis: [
                        {
                            type: 'category',
                            data:x_list,
                        }
                    ],
                    dataZoom: [
                        {
                            show: true,
                            start: 94,
                            end: 100
                        },
                        {
                            type: 'inside',
                            start: 94,
                            end: 100,
                        },
                        {
                            show: true,
                            yAxisIndex: 0,
                            filterMode: 'empty',
                            width: 20,
                            height: '75%',
                            showDataShadow: false,
                            left: '1%'
                        }
                    ],

                    series: [
                        {
                            name:"岗位需求量",
                            type: 'bar',
                            data: y_list,
                            center: ['70%', '30%'],

                        },
                        {
                        type: 'pie',
                        radius: '55%',
                        center: ['85%', '50%'],
                        data: Object.keys(dict_data).map(function (key) {return {
                                                                                        name: key,
                                                                                        value: dict_data[key]}
                                                                                })
                    }
                    ]
    };
            myCharts.setOption(option);
        }
    })
});